<script setup lang="ts" name='check_apply_list'>
import { ref, reactive, onMounted } from "vue";
import { translateCode2Name } from '@/utils/constantsUtils'
import CheckApplyDetail from "./check_apply_detail.vue";
import { useRoute } from "vue-router";
import { service } from "@/utils/request";

const route = useRoute()

const registId = route.query.registId

//患者基本信息
const registerForm = reactive({
       name: '',
       age: 0,
       gender: ''
})
//已开立检查项目数据
const tableData = ref<any[]>([])

//已选择的 待执行的检查项目id
const itemId = ref();
const status = ref<string>('');


//是否显示  检查详情
const showDetailDialog = ref(false);

function update() {
       showDetailDialog.value = false;
       initPage()
}
function initPage() {
       //调用接口
       registerForm.age = 18;
       registerForm.name = '张三xxxx'
       registerForm.gender = '男'

       service.get("/yiji/queryRegistCheckDetail", {
              params: {
                     registId: registId
              }
       }).then((result: any) => {
              const { registerPO, checkApplyPOS } = result;

              registerForm.name = registerPO.name
              registerForm.age = registerPO.age
              registerForm.gender = registerPO.gender;


              //已开立的检查申请
              tableData.value = checkApplyPOS;
       })
}


function doCheck(selectItemId: string, currentStatus: string) {
       showDetailDialog.value = true;
       itemId.value = selectItemId
       status.value = currentStatus
}


//组件挂在
onMounted(() => {
       initPage()
})





</script>

<template>

       查询患者 已申请的 检查项目 :{{ registId }}

       <el-row>


              <el-col :span="24">

                     <el-form v-model="registerForm" inline>
                            <el-form-item label="患者姓名">
                                   <el-input v-model="registerForm.name" readonly> </el-input>
                            </el-form-item>
                            <el-form-item label="患者年龄">
                                   <el-input v-model="registerForm.age" readonly></el-input>
                            </el-form-item>
                            <el-form-item label="患者性别">
                                   <el-input v-model="registerForm.gender" readonly></el-input>
                            </el-form-item>
                     </el-form>

                     <div>
                            已开立的检查
                     </div>
                     <el-table width="100%" :data="tableData">
                            <el-table-column label="项目名称" prop="name"></el-table-column>
                            <el-table-column label="单价" prop="price"></el-table-column>

                            <el-table-column label="费用状态" prop="status">
                                   <template #default="scope">
                                          {{ translateCode2Name('CheckApplyStatus', scope.row.status) }}
                                   </template>

                            </el-table-column>

                            <el-table-column label="操作">
                                   <template #default="scope">
                                          <el-button v-if="scope.row.status == 2" link type="primary"
                                                 @click="doCheck(scope.row.itemId, '2')">执行检查 </el-button>
                                          <el-button v-if="scope.row.status == 3" link type="primary"
                                                 @click="doCheck(scope.row.itemId, '3')">查看检查结果 </el-button>
                                   </template>

                            </el-table-column>


                     </el-table>


              </el-col>


       </el-row>


       <el-dialog v-model="showDetailDialog" title="检查执行" width="500px">

              <CheckApplyDetail v-if="showDetailDialog" :itemId="itemId" :currentStatus="status" :update="update">
              </CheckApplyDetail>


       </el-dialog>



</template>



<style scoped></style>